<template>
  <div>
    <slot name="left"></slot>
    <el-button
      type="primary"
      plain
      v-if="actions.indexOf('edit')>-1"
      size="mini"
      @click="editItem"
    >编辑</el-button>
    <slot name="mid"></slot>
    <el-button
      type="danger"
      v-if="actions.indexOf('delete')>-1"
      plain
      size="mini"
      @click="deleteItem"
      :loading="loading"
    >删除</el-button>
    <slot name="right"></slot>
  </div>
</template>

<script>
export default {
  data(){
    return {
      loading:false
    }
  },
  props: {
    row: Object,
    actions: {
      type: Array,
      default() {
        return ["delete", "edit"];
      }
    },
    deleteProps:{
      type:Object,
      default:{
        message:"该操作将删此记录，确定删除？"
      }
    }
  },
  methods: {
    deleteItem() {
      this.$confirm(this.deleteProps.message, () => {
        this.loading = true;
        this.$emit("deleteItem",this.row.id)
      });
    },
    editItem() {
      this.$emit("editItem", this.row);
    }
  }
};
</script>

<style lang="scss" scoped>
</style>
